<template>
  <div class="content" v-loading="submitBtn">
    <div class="scroll-view-box">
      <div class="user-title-box">采购明细</div>
      <el-form label-width="120px" :inline="true" :model="formData" :rules="formRules" ref="elFrom"
        label-position="top">
        <el-form-item label="采购项目" prop="name">
          <el-select filterable v-model="formData.customer_sex" placeholder="请选择客户性别" clearable class="input-width">
            <el-option v-for="item in 1" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="下单日期" prop="phone">
          <el-date-picker v-model="formData.value1" type="date" placeholder="选择下单日期" class="input-width">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="备注" prop="customer_identity">
          <el-input v-model="formData.customer_age" placeholder="输入备注" clearable class="input-width"></el-input>
        </el-form-item>
        <el-form-item label="保险合同" prop="customer_attention">
          <div class="file-list-box">
            <div class="file-item-box" v-for="(item, index) in 3" :key="index">
              <div class="el-icon-delete-box">
                <i class="el-icon-error"></i>
              </div>
              <el-tooltip class="item" effect="dark" :content="item.name" placement="top">
                <img class="img" src="@/assets/icon/index-bg.png" />
              </el-tooltip>
            </div>
            <el-upload multiple class="avatar-uploader" action="#" :show-file-list="false" :auto-upload="false"
              list-type="picture-card" :on-change="changeFile">
              <i class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="saveSubmit" :loading="submitBtn">提交</el-button>
        <el-button @click="cancelFunc">关闭</el-button>
      </div>
    </div>
  </div>
</template>
<script>
import brandApi from '@/api/brandApi';

export default {
  data() {
    return {
      loading: false,
      editType: 'add',
      formData: {
        id: '',
      },
      formRules: {
        customer_type: [
          {
            required: true,
            message: "请输入",
            trigger: "change",
          },
        ],
      },
      submitBtn: false,
    };
  },
  computed: {
  },
  mounted() {
    let id = this.$route.query.sn
    if (id) {
      brandApi.getBrandDetail({ brand_id: id }).then(res => {
        console.log(res, '品牌详情')
        if (res.code == 200) {
          let data = res.data
          let formData = this.formData
          let bind_json = []
          res.data.store_list.map(item => {
            bind_json.push({
              store_type_id: item.store_type_id,
              template_id: item.template_id
            })
          })
          formData.id = id
          formData.name = data.name
          formData.abbreviation = data.abbreviation
          formData.colour = data.colour
          formData.bind_json = bind_json
          this.editType = 'update'
        }

        this.loading = false
      })
    }
  },
  methods: {
    // 选择文件
    changeFile(e) {
      console.log(e)
    },
    // 提交
    saveSubmit() {
      this.$refs['elFrom'].validate((valid) => {
        if (valid) {
          let formData = this.formData
          this.submitBtn = true;
          if (this.editType == 'add') {
            brandApi.xxxxx({

            }).then(res => {
              console.log(res, '新增增减项')
              if (res.code == 200) {
                this.$message({
                  message: "添加成功",
                  type: "success",
                });
                this.cancelFunc()
              } else {
                this.$message.error(res.message);
              }
              this.submitBtn = false;
            })
          } else {
            brandApi.xxxxx({

            }).then(res => {
              console.log(res, '更新增减项')
              if (res.code == 200) {
                this.$message({
                  message: "更新成功",
                  type: "success",
                });
                this.cancelFunc()
              } else {
                this.$message.error(res.message);
              }
              this.submitBtn = false;
            })
          }
        } else {
          return false;
        }
      });
    },
    // 取消
    cancelFunc() {
      this.$goBackTab(this);
    },
  },
};
</script>
<style lang="scss" scoped>
@import "@/styles/addPage.scss";
</style>